<!-- 理化检测任务单详情(委托型) -->
<template>
  <div class="dialog-container" id="dialog-container">
    <el-dialog v-dialogDrag :fullscreen="isFullScreen" :custom-class="isFullScreen?'fullscreen-default-dialog':'vertical-center-dialog'" append-to-body :close-on-click-modal="false" :visible.sync="dialogVisible" @close="$emit('update:show', false)" :before-close="handleClose"
      :show="show" width="800px">
      <div slot="title">
        <span style="color:white;">{{this.detailName}}</span>
        <button type="button" aria-label="fullScreen" class="el-dialog__headerbtn" style="margin-right:25px;" @click="isFullScreen = !isFullScreen">
                                        <i class="el-dialog__close iconfont icon-fuzhicopy22"></i>
                                      </button>
      </div>
      <div style="overflow: hidden;">
        <img src="../../../../assets/images/sagw.png" style="float:left;">
        <h2 style="text-align:center;">理化检测任务单</h2>
      </div>
      <el-form :model="form" ref="form" :inline="true" label-width="130px" size="small">
        <el-row>
          <el-col :span="12">
            <el-form-item label="零件号：">
              <el-input v-model="form.partNumber" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="热处理炉号：">
              <el-input v-model="form.heatingNumber" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
              <el-form-item label="任务类型：" prop="taskType">
                  <!-- <el-input v-model="form.taskType" disabled auto-complete="off"></el-input> -->
                  {{getType(form.taskType)}}
                </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="零件名称：">
              <el-input v-model="form.partName" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="批次零件总数量：">
              <el-input v-model="form.totalPartNo" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="委托方：">
              <el-input v-model="form.applyUser.name" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="零件图号：">
              <el-input v-model="form.partGraphNumber" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="材料牌号：">
              <el-input v-model="form.materialNo" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="委托日期：">
              <el-date-picker v-model="form.applyTime" type="date" disabled style="width: 200px;"></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="图纸版本：">
              <el-input v-model='form.partGraphNumber' disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="材料炉号：">
              <el-input v-model="form.materialFurnanceNumber" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="委托单号：">
              <el-input v-model='form.taskNo' disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="需求完成日期：">
              <el-input v-model="form.expectCompleteTime" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="样品信息：">
              {{this.sampleStatusName}}共 {{form.quantity}} 件
              <!-- <el-radio-group v-model="form.sampleStatus" disabled>
                <el-radio label="实物">{{this.sampleStatusName}}共
                  <el-input v-if="form.sampleStatus == '1'" v-model="form.quantity" disabled style="width: 70px;margin: 0 5px;"></el-input>件</el-radio>
                <el-radio label="试样">试样
                  <el-input v-if="form.sampleStatus == '试样'" v-model="form.quantity" disabled style="width: 70px;margin: 0 5px;"></el-input>件</el-radio>
              </el-radio-group> -->
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="备注：">
              <el-input type="textarea" v-model="form.remark" disabled style="width: 580px;"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="任务目的与要求：">
              <el-radio-group v-model="form.taskTarget" disabled>
                <el-radio label="新产品试制">新产品试制</el-radio>
                <el-radio label="常规均匀性实验">常规均匀性实验</el-radio>
                <el-radio label="失效零件分析">失效零件分析</el-radio>
                <el-radio label="复检">复检</el-radio>
                <el-radio label="设备新增/大修验收">设备新增/大修验收</el-radio>
                <el-radio label="其他">其他</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="任务单详情" name="first">
          <el-tabs v-model="activeSampleInspectionContentsName">
            <el-tab-pane :label="item.title" :name="item.title" v-for="item in editableTabs" :key="item.id">
              <el-table :data="tableData">
                <el-table-column type='index' label="编号" align="center" width="60"></el-table-column>
                <el-table-column prop="fieldName" label="检测项目" align="center" width="100"></el-table-column>
                <el-table-column prop="testPart" label="检测位置" align="center" width="100">
                  <template slot-scope="scope">
                          {{getPosition(scope.row.testPart)}}
</template>
            </el-table-column>
            <el-table-column prop="standardName" label="检测要求" align="center" width="150"></el-table-column>
            <!--<el-table-column label="实测数据">
              <el-table-column prop="act1" label="1" align="center" width="50"></el-table-column>
              <el-table-column prop="act2" label="2" align="center" width="50"></el-table-column>
              <el-table-column prop="act3" label="3" align="center" width="50"></el-table-column>
              <el-table-column prop="act4" label="4" align="center" width="50"></el-table-column>
              <el-table-column prop="act5" label="5" align="center" width="50"></el-table-column>
            </el-table-column>
            <el-table-column prop="device" label="检测设备" align="center" width="200"></el-table-column>
            <el-table-column prop="remark" label="备注" align="center" width="200"></el-table-column>-->
          </el-table>
          </el-tab-pane></el-tabs>
        </el-tab-pane>
        <el-tab-pane label="操作记录" name="second">
          <el-table :data="recordData" border>
            <el-table-column type="index" label="序号" align="center" width="50"></el-table-column>
            <el-table-column prop="operateTime" label="时间" align="center" width=""></el-table-column>
            <el-table-column prop="operateType" label="操作记录" align="center" width=""></el-table-column>
            <el-table-column prop="operateRole" label="操作角色" align="center" width=""></el-table-column>
            <el-table-column label="用户名" prop="user.username" align="center"></el-table-column>
            <el-table-column prop="result" label="操作结果" align="center" width="">
<template slot-scope="scope">
  <span v-if="scope.row.result == 1">通过</span>
  <span v-else>不通过</span>
</template>
            </el-table-column>
            <el-table-column prop="remark" label="备注" align="center" width=""></el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="Close">关 闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import SelectPartNumber from '../select-part-number-button'; // 选择零件号
    import {
    APPLY_TYPE_LIST,
    APPLY_STATUS_LIST
  } from "../../../../service/constant";
  import {
    getApplyInfoByIdService,
    getOperateLogService,
    getPositionList,
    getSampleStatusDrop
  } from 'service/task';
  import {
    getLableFromList
  } from '../../../../utils/common';
  export default {
    components: {
      'select-part-number-button': SelectPartNumber,
    },
    data() {
      return {
        activeSampleInspectionContentsName: "样品1",
        isFullScreen: false,
        dialogVisible: this.show,
        title: "理化检测任务单详情（委托型）",
        activeName: 'first',
        editableTabs: [{
          id: 1,
          title: "样品1"
        }],
        form: {
          partNumber: '',
          heatingNumber: '',
          taskType: '',
          partName: '',
          totalPartNo: '',
          applyUser: '',
          partGraphNumber: '',
          materialNo: '',
          applyTime: '',
          materialFurnanceNumber: '',
          expectCompleteTime: '',
          sampleStatus: '',
          quantity: '',
          remark: ''
        },
        sampleStatusName:"",
        tableData: [],
        recordData: [],
        positionList: [],
      }

    },
    props: {
      show: {
        type: Boolean,
        default: false,
      },
      detailId: {
        type: String
      },
      detailName: {
        type: String
      }
    },
    watch: {
      show() {
        this.dialogVisible = this.show;
        if (this.dialogVisible) {
          getApplyInfoByIdService(this.detailId)
            .then(res => {
              // this.form.taskNo = ;
              this.form = res.data.result;
              // this.form.taskType = res.data.result.taskType;
              // this.form.applyOrgName = res.data.result.applyUser.org.name;
              // this.form.applyUser = res.data.result.applyUser.name;
              // this.form.expectCompleteTime = res.data.result.expectCompleteTime;
              // this.form.projectNo = res.data.result.projectNo;
              // this.form.partNumber = res.data.result.partNumber;
              // this.form.partGraphNumber = res.data.result.partGraphNumber;
              // this.form.partName = res.data.result.partName;
              // this.form.materialNo = res.data.result.materialNo;
              // this.form.totalPartNo = res.data.result.totalPartNo;
              // this.form.sampleStatusPhase = res.data.result.sampleStatusPhase;
              // this.form.materialFurnanceNumber = res.data.result.materialFurnanceNumber;
              // this.form.heatingNumber = res.data.result.heatingNumber;
              // this.form.sampleStatus = res.data.result.sampleStatus;
              // this.form.quantity = res.data.result.quantity;
              // this.form.batchNumber = res.data.result.batchNumber;
              // this.form.provider = res.data.result.provider;
              // this.form.remark = res.data.result.remart;
              getSampleStatusDrop().then(res2 => {
                for(let i=0; i<res2.data.result.length;i++){
                    if(res.data.result.sampleStatus==res2.data.result[i].code){
                      this.sampleStatusName=res2.data.result[i].name;
                    }
                }
              });
              if (!this.form.applyUser) {
                this.form.applyUser = {};
              }

              getPositionList().then(res1 => {

                this.positionList = res1.data.result;
                if (this.form.taskFieldList) {
                  for (let i = 0; i < this.form.taskFieldList.length; i++) {
                    this.form.taskFieldList[i].positionStr = getLableFromList(this.positionList, this.form.taskFieldList[i].testPart);
                  }
                }
              });

              this.editableTabs = [];
              for (let i = 1; i <= this.form.quantity; i++) {
                this.editableTabs.push({
                  id: i,
                  title: `样品${i}`
                });
              }

              this.tableData = this.form.taskFieldList;

              console.log(this.tableData);
            });
        }
        // 操作记录
        getOperateLogService(this.detailId, 1, 5, '', 'ASC')
          .then(res => {
            console.log(res)
            if (res.data.success) {
              this.recordData = res.data.result.content;
            }
          })
      }
    },
    methods: {
      Close(){
        this.sampleStatusName="";
        this.dialogVisible = false
      },
      getPosition(type) {
        return getLableFromList(this.positionList, type);
      },
      handleClose() { /* 关闭的时候更新状态值 */
        this.sampleStatusName="";
        this.isFullScreen = false;
        this.dialogVisible = false;
      },
        getType(t) {
        return getLableFromList(APPLY_TYPE_LIST, t);
      },
      handleClick(tab, event) {
        if (this.activeName == "first") {
          this.title = "理化检测任务单详情";
        } else {
          this.title = "理化检测任务单操作记录";
        }
      }
    }
  }
</script>
